<template>
 <div style="width: 100%;height: 100%;padding: 16px 20px;position: relative;">
  <div style="width: 400px;background-color: white;height: 100%;border-radius: 5px;float: right;">
    <div v-if="rightPageId==0">
      <div style="padding: 20px 20px;border-bottom: 1px solid var(--color-neutral-4);position: relative;">
        菜单
      </div>
      <div style="padding: 10px 10px;height: calc(100% - 56.76px);width: 100%;overflow-y: scroll;">
          <div class="right-button" @click="rightPageId=1">
              添加专业目录
              <svg width="15" height="15" viewBox="0 0 48 48" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M32.556 24L16.293 7.737a1 1 0 010-1.415l1.414-1.414a1 1 0 011.414 0L36.8 22.586a2 2 0 010 2.828L19.121 43.092a1 1 0 01-1.414 0l-1.414-1.414a1 1 0 010-1.414L32.556 24z" fill="currentColor"/></svg>
          </div>
          <div class="right-button" @click="rightPageId=3">
              导入专业目录
              <svg width="15" height="15" viewBox="0 0 48 48" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M32.556 24L16.293 7.737a1 1 0 010-1.415l1.414-1.414a1 1 0 011.414 0L36.8 22.586a2 2 0 010 2.828L19.121 43.092a1 1 0 01-1.414 0l-1.414-1.414a1 1 0 010-1.414L32.556 24z" fill="currentColor"/></svg>
          </div>
          <div class="right-button" @click="rightPageId=4">
              删除选中的专业目录
              <svg width="15" height="15" viewBox="0 0 48 48" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M32.556 24L16.293 7.737a1 1 0 010-1.415l1.414-1.414a1 1 0 011.414 0L36.8 22.586a2 2 0 010 2.828L19.121 43.092a1 1 0 01-1.414 0l-1.414-1.414a1 1 0 010-1.414L32.556 24z" fill="currentColor"/></svg>
          </div>
          <div class="right-button" @click="rightPageId=5">
              删除全部专业目录
              <svg width="15" height="15" viewBox="0 0 48 48" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M32.556 24L16.293 7.737a1 1 0 010-1.415l1.414-1.414a1 1 0 011.414 0L36.8 22.586a2 2 0 010 2.828L19.121 43.092a1 1 0 01-1.414 0l-1.414-1.414a1 1 0 010-1.414L32.556 24z" fill="currentColor"/></svg>
          </div>
        </div>
    </div>
    <div v-if="rightPageId==1" style="height: calc(100%);">
      <div style="padding: 20px 20px;font-size: 14px;border-bottom: 1px solid var(--color-neutral-4);position: relative;padding-left: 55px;">
            <div style="padding: 20px 20px;position: absolute;left: 0;top: 0;cursor: pointer;" @click="()=>{
                rightPageId=0
            }">
              <svg width="15" height="15" viewBox="0 0 48 48" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.272 24l16.263 16.264a1 1 0 010 1.414l-1.414 1.414a1 1 0 01-1.414 0L11.03 25.414a2 2 0 010-2.828L28.706 4.908a1 1 0 011.414 0l1.415 1.414a1 1 0 010 1.415L15.271 24z" fill="currentColor"/></svg>
            </div>
              添加专业目录
        </div>
        <div style="width: 100%;height: calc(100% - 112px);overflow-y: scroll;padding: 20px 20px;">
          <div style="margin-bottom: 10px;">
            门类
            <a-input v-model="addForm.class" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入专业代码" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            专业类
            <a-input v-model="addForm.majorClass" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入专业类" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            专业名称
            <a-input v-model="addForm.majorName" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入专业名称" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            专业代码
            <a-input v-model="addForm.majorId" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入专业代码" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            学位授予门类
            <a-input v-model="addForm.degree" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入学位授予门类" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            修业年限
            <a-input v-model="addForm.year" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入修业年限" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            增设年份
            <a-input v-model="addForm.addYear" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入增设年份" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            备注
            <a-input v-model="addForm.remark" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入备注" allow-clear></a-input>
          </div>
        </div>
        <div style="padding: 10px 20px;text-align: right;">
          <a-button style="padding: 0 30px;" type="primary" :loading="isAdding" @click="addMajorContent">添加</a-button>
        </div>
    </div>
    <div v-if="rightPageId==2" style="height: calc(100%);">
      <div style="padding: 20px 20px;font-size: 14px;border-bottom: 1px solid var(--color-neutral-4);position: relative;padding-left: 55px;">
            <div style="padding: 20px 20px;position: absolute;left: 0;top: 0;cursor: pointer;" @click="()=>{
                rightPageId=0
            }">
              <svg width="15" height="15" viewBox="0 0 48 48" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.272 24l16.263 16.264a1 1 0 010 1.414l-1.414 1.414a1 1 0 01-1.414 0L11.03 25.414a2 2 0 010-2.828L28.706 4.908a1 1 0 011.414 0l1.415 1.414a1 1 0 010 1.415L15.271 24z" fill="currentColor"/></svg>
            </div>
              修改专业目录
        </div>
        <div style="width: 100%;height: calc(100% - 112px);overflow-y: scroll;padding: 20px 20px;">
          <div style="margin-bottom: 10px;">
            门类
            <a-input v-model="updateForm.class" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入专业代码" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            专业类
            <a-input v-model="updateForm.majorClass" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入专业类" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            专业名称
            <a-input v-model="updateForm.majorName" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入专业名称" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            专业代码（不可修改）
            <a-input :disabled="true" v-model="updateForm.majorId" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入专业代码" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            学位授予门类
            <a-input v-model="updateForm.degree" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入学位授予门类" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            修业年限
            <a-input v-model="updateForm.year" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入修业年限" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            增设年份
            <a-input v-model="updateForm.addYear" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入增设年份" allow-clear></a-input>
          </div>
          <div style="margin-bottom: 10px;">
            备注
            <a-input v-model="updateForm.remark" style="height: 35px;margin-top: 5px;padding: 0 0;background-color: white;border: 0;border-bottom: 1px solid rgb(0,120,215);" placeholder="请输入备注" allow-clear></a-input>
          </div>
        </div>
        <div style="padding: 10px 20px;text-align: right;">
          <a-button style="padding: 0 30px;" type="primary" :loading="isUpdating" @click="updateMajorContent">修改</a-button>
        </div>
    </div>
    <div v-if="rightPageId==3" style="height: 100%;">
      <div style="padding: 20px 20px;font-size: 14px;border-bottom: 1px solid var(--color-neutral-4);position: relative;padding-left: 55px;">
            <div style="padding: 20px 20px;position: absolute;left: 0;top: 0;cursor: pointer;" @click="()=>{
              if(importMajorContentStep!=2){
rightPageId=0
              } 
            }">
              <svg width="15" height="15" viewBox="0 0 48 48" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.272 24l16.263 16.264a1 1 0 010 1.414l-1.414 1.414a1 1 0 01-1.414 0L11.03 25.414a2 2 0 010-2.828L28.706 4.908a1 1 0 011.414 0l1.415 1.414a1 1 0 010 1.415L15.271 24z" fill="currentColor"/></svg>
            </div>
              导入专业目录
        </div>
        <div style="width: 100%;height: calc(100% - 56.75px);padding: 20px 20px;overflow-y: scroll;">
          <div style="line-height: 25px;margin-bottom: 20px;">
                <p>表格文件要求</p>
                <p>1.专业目录数据应保存在表格文件的第一个表格中；</p>
                <p>2.表格的第一行应为每一列数据的标题，并且必须包括“门类”、“专业类”、“专业名称”、“专业代码”、“学位授予门类”、“修业年限”、“增设年份”、“备注”和“院校类别”这几个标题；</p>
                <p>3.如果表格文件符合上面的要求但是不能正常导入，可能是表格内某些单元格的值过长造成的。</p>
              </div>
              <div>
                <a-steps label-placement="horizontal" direction="vertical" :current="importMajorContentStep">
                <a-step>选择Excel文件
                  <br>
                  <input style="font-size: 14px;" :disabled="importMajorContentStep!=1" type="file" ref="upload" accept=".xls,.xlsx" class="outputlist_upload" @change="readExcel">
                  <br>
                  <div v-if="importMajorContentWarningText!=''" style="line-height: 30px;color: red;margin-bottom: 15px;">
                    {{ importMajorContentWarningText }}
                  </div>
                </a-step>
                <a-step>正在导入
                  <br>
                  <a-button v-if="importMajorContentStep==2" :loading="true" style="background-color: white !important;color: black !important;margin-top: 10px;">正在处理，请耐心等待。
                    <br>请不要关闭浏览器或离开当前页面。
                    <br>已完成{{  parseInt(importedMajorContentsNum/importMajorContentsNum*100) }}%
                  </a-button>
                </a-step>
                <a-step>完成导入
                  <br>
                  <div v-if="importMajorContentStep==3" style="font-size: 14px;">
                    共导入{{ importMajorContentsNum }}个专业目录。
                  </div>
                </a-step>
              </a-steps>
              </div>
        </div>
    </div>
    <div v-if="rightPageId==4" style="height: 100%;width: 100%;">
      <div style="padding: 20px 20px;font-size: 14px;border-bottom: 1px solid var(--color-neutral-4);position: relative;padding-left: 55px;">
            <div style="padding: 20px 20px;position: absolute;left: 0;top: 0;cursor: pointer;" @click="()=>{
              if(isDeleting==false){
rightPageId=0
              } 
            }">
              <svg width="15" height="15" viewBox="0 0 48 48" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.272 24l16.263 16.264a1 1 0 010 1.414l-1.414 1.414a1 1 0 01-1.414 0L11.03 25.414a2 2 0 010-2.828L28.706 4.908a1 1 0 011.414 0l1.415 1.414a1 1 0 010 1.415L15.271 24z" fill="currentColor"/></svg>
            </div>
              删除选中的专业目录
        </div>
        <div style="padding: 20px 20x;">
          <div style="padding: 20px 20px;">
          <div style="margin-bottom: 15px;">
            此操作将删除选中的专业目录且不可恢复。
          </div>
          <div style="text-align: right;">
            <a-button type="primary" status="danger" style="padding: 0 30px;" :loading="isDeleting" @click="deleteSelected">删除</a-button>
          </div>
        </div>
        </div>
    </div>
    <div v-if="rightPageId==5" style="height: 100%;width: 100%;">
      <div style="padding: 20px 20px;font-size: 14px;border-bottom: 1px solid var(--color-neutral-4);position: relative;padding-left: 55px;">
            <div style="padding: 20px 20px;position: absolute;left: 0;top: 0;cursor: pointer;" @click="()=>{
              if(isDeleting==false){
rightPageId=0
              } 
            }">
              <svg width="15" height="15" viewBox="0 0 48 48" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.272 24l16.263 16.264a1 1 0 010 1.414l-1.414 1.414a1 1 0 01-1.414 0L11.03 25.414a2 2 0 010-2.828L28.706 4.908a1 1 0 011.414 0l1.415 1.414a1 1 0 010 1.415L15.271 24z" fill="currentColor"/></svg>
            </div>
              删除全部专业目录
        </div>
        <div style="padding: 20px 20x;">
          <div style="padding: 20px 20px;">
          <div style="margin-bottom: 15px;">
            此操作将删除全部专业目录且不可恢复。
          </div>
          <div style="text-align: right;">
            <a-button type="primary" status="danger" style="padding: 0 30px;" :loading="isDeleting" @click="deleteAll">删除</a-button>
          </div>
        </div>
        </div>
    </div>
  </div>
  <div style="height: 100%;width: calc(100% - 420px);border-radius: 5px;background-color: white;">
    <div style="padding: 20px 20px;border-bottom: 1px solid var(--color-neutral-4);position: relative;">
      专业目录管理
    </div>
    <div style="width: 100%;height: calc(100% - 56.75px);padding: 20px 20px;position: relative;">
      <div style="width: 100%;">
        <span>
          <div style="display: inline-block;width: calc(25% - 4px);">
            门类
            <a-input v-model="searchForm.class" allow-clear style="border: 0px;border-bottom: 1px solid rgb(0,120,215);background-color: white;padding: 0 0;height: 35px;" placeholder="请输入门类"></a-input>
          </div>
        </span>
        <span>
          <div style="display: inline-block;width: calc(25% - 4px);margin-left: 5.3px;">
            专业类
            <a-input v-model="searchForm.majorClass" allow-clear style="border: 0px;border-bottom: 1px solid rgb(0,120,215);background-color: white;padding: 0 0;height: 35px;" placeholder="请输入专业类"></a-input>
          </div>
        </span>
        <span>
          <div style="display: inline-block;width: calc(25% - 4px);margin-left: 5.3px;">
            专业名称
            <a-input v-model="searchForm.majorName" allow-clear style="border: 0px;border-bottom: 1px solid rgb(0,120,215);background-color: white;padding: 0 0;height: 35px;" placeholder="请输入专业名称"></a-input>
          </div>
        </span>
        <span>
          <div style="display: inline-block;width: calc(25% - 4px);margin-left: 5.3px;">
            专业代码
            <a-input v-model="searchForm.majorId" allow-clear style="border: 0px;border-bottom: 1px solid rgb(0,120,215);background-color: white;padding: 0 0;height: 35px;" placeholder="请输入专业代码"></a-input>
          </div>
        </span>
      </div>
      <div style="margin-top: 10px;text-align: right;">
        <a-button style="padding: 0 30px;" :loading="isSearching" @click="()=>{
          searchForm=searchFormModel;
          getMajorContents();
        }">显示全部</a-button>
        <a-button style="padding: 0 30px;margin-left: 10px;" type="primary" :loading="isSearching" @click="getMajorContents">查找</a-button>
      </div>
    <a-table @row-click="(e)=>{
      this.updateForm=e;
      this.rightPageId=2;
    }" v-model:selected-keys="selectedKeys" :row-selection="{
      type: 'checkbox',
      showCheckedAll: true
    }" :loading="isSearching" :columns="[
      {
        title:'门类',
        dataIndex:'class',
      },
      {
        title:'专业类',
        dataIndex:'majorClass',
      },
      {
        title:'专业名称',
        dataIndex:'majorName',
      },
      {
        title:'专业代码',
        dataIndex:'majorId',
      },
    ]" style="margin-top: 10px;" :data="majorContents"></a-table>
    </div>
  </div>
 </div>
</template>

<script>
import { read, utils } from 'xlsx'
// const xlsx = XLSX
import axios from 'axios'
// import path from 'path'

export default{
  data(){
    return{
      searchForm:{
        class:'',
        majorClass:'',
        majorName:'',
        majorId:'',
      },
      searchFormModel:{
        class:'',
        majorClass:'',
        majorName:'',
        majorId:'',
      },
      addForm:{
        class:'',
        majorClass:'',
        majorName:'',
        majorId:'',
        degree:'',
        year:'',
        addYear:'',
        remark:'',
      },
      addFormModel:{
        class:'',
        majorClass:'',
        majorName:'',
        majorId:'',
        degree:'',
        year:'',
        addYear:'',
        remark:'',
      },
      updateForm:undefined,
      isSearching:false,
      majorContents:[],
      rightPageId:0,
      isAdding:false,
      selectedKeys:[],
      isUpdating:false,
      importMajorContentStep:1,
      importMajorContentWarningText:'',
      importMajorContentsNum:0,
      importedMajorContentsNum:0,
      isDeleting:false,
    }
  },
  mounted(){
    this.getMajorContents();
  },
  methods:{
    deleteAll(){
      this.isDeleting=true;
      var config = {
   method: 'post',
   url: '/api/v1/majorcontents/deleteAll',
   headers: { 
      'Accept': '*/*', 
   }
};

axios(config)
.then((res) => {
  this.isDeleting=false;
   if(res.data.status==1){
    this.rightPageId=0;
    this.getMajorContents();
   }else{
    this.$message.error({
      content:res.data.content
    })
   }
})
    },
    deleteSelected(){
      if(this.selectedKeys.length==0){
        this.$message.error({
          content:'未选择专业目录',
        })
        return;
      }
      var config = {
   method: 'post',
   url: '/api/v1/majorcontents/deleteSelected',
   headers: { 
      'Accept': '*/*', 
   },
   data : JSON.stringify(this.selectedKeys)
};

axios(config)
.then((res) => {
   if(res.data.status==1){
    this.rightPageId=0;
    this.getMajorContents();
   }else{
    this.$message.error({
      content:'删除失败'
    })
   }
})
    },
    importMajorContentsToBackground(arr,start,resend){
      let pre = [];
      for(let i=start;i<start+15;i++){
        if(arr[i]==undefined)continue;
        pre.push(arr[i]);
      }
      if(resend!=undefined){
        pre=resend;
      }
      var config = {
   method: 'post',
   url: '/api/v1/majorcontents/import',
   headers: { 
      'Accept': '*/*', 
   },
   data : JSON.stringify(pre)
};

axios(config)
.then((res) => {
  if(res.data.status==2){
    this.importMajorContentsToBackground(arr,start,pre);
  }else{
    this.importedMajorContentsNum+=pre.length;
   if(arr.length-1<=start+15){
    this.importMajorContentStep=3;
    this.getMajorContents();
   }else{
    this.importMajorContentsToBackground(arr,start+15);
   }
  }
  
})
    },
    readExcel(e) {
      this.importMajorWarningText='';
//  var that = this;
const files = e.target.files;
// 如果没有文件名
if(files.length<=0){
return false;
}else if(!/\.(xls|xlsx)$/.test(files[0].name.toLowerCase())){
this.$Message.error('上传格式不正确，请上传xls或者xlsx格式');
return false;
}
this.importUniversityStep=2;
const fileReader = new FileReader();
fileReader.onload = (ev) => {
try {
const data = ev.target.result;
// 切换为新的调用方式
const workbook = read(data, {
type: 'binary'
});
// 取第一张表
const wsname = workbook.SheetNames[0];
// 切换为新的调用方式 生成json表格内容
const ws = utils.sheet_to_json(workbook.Sheets[wsname]);
console.log(ws);
// 后续为自己对ws数据的处理
let pre = [];
for(let i=0;i<ws.length;i++){
  pre.push({
    class:ws[i]['门类'],
    majorClass:ws[i]['专业类'],
    majorName:ws[i]['专业名称'],
    majorId:ws[i]['专业代码'],
    degree:ws[i]['学位授予门类'],
    year:ws[i]['修业年限'],
    addYear:ws[i]['增设年份'],
    remark:ws[i]['备注'],
  })
}
this.importMajorContentsNum=pre.length;
this.importedMajorContentsNum=0;
this.importMajorContentsToBackground(pre,0);
this.importMajorContentStep=2;

} catch (e) {
return false;
}
};
fileReader.readAsBinaryString(files[0]);
    },
    updateMajorContent(){
      const checkItems = ['class','majorClass','majorName','majorId','degree','year','addYear','remark'];
      const checkItemsTranslate = ['门类','专业类','专业名称','专业代码','学位授予门类','修业年限','增设年份','备注'];
      for(let i=0;i<checkItems.length;i++){
        if(this.updateForm[checkItems[i]]==''){
          this.$message.error({
            content:'未输入' + checkItemsTranslate[i] + ''
          })
          return;
        }
      }
      this.isUpdating=true;
      var config = {
   method: 'post',
   url: '/api/v1/majorcontents/update?data=' + JSON.stringify(this.updateForm),
   headers: { 
      'Accept': '*/*', 
   }
};

axios(config)
.then((res) => {
  this.isUpdating=false;
   if(res.data.status==1){
    this.rightPageId=0;
    this.getMajorContents();
   }else{
    this.$message.error({
      content:res.data.content
    })
   }
})
    },
    addMajorContent(){
      const checkItems = ['class','majorClass','majorName','majorId','degree','year','addYear','remark'];
      const checkItemsTranslate = ['门类','专业类','专业名称','专业代码','学位授予门类','修业年限','增设年费','备注'];
      for(let i=0;i<checkItems.length;i++){
        if(this.addForm[checkItems[i]]==''){
          this.$message.error({
            content:'未输入' + checkItemsTranslate[i] + ''
          })
          return;
        }
      }

      this.isAdding=true;
      var config = {
   method: 'post',
   url: '/api/v1/majorcontents/add?data=' + JSON.stringify(this.addForm),
   headers: { 
      'Accept': '*/*', 
   }
};

axios(config)
.then((res) => {
  this.isAdding=false;
   if(res.data.status==1){
    this.addForm=this.addFormModel;
    this.getMajorContents();
   }else{
    this.$message.error({
      content:res.data.content
    })
   }
})
    },  
    getMajorContents(){
      this.isSearching=true;
      var config = {
   method: 'get',
   url: '/api/v1/majorContents/search?data=' + JSON.stringify(this.searchForm),
   headers: { 
      'Accept': '*/*', 
   }
};

axios(config)
.then((res) => {
  this.isSearching=false;
   if(res.data.status==1){
    this.majorContents=res.data.results;
    for(let i=0;i<this.majorContents.length;i++){
      this.majorContents[i]['key']=this.majorContents[i].majorId;
    }
   }else{
    this.$message.error({
      content:res.data.content
    })
   }
})
    }
  },
  props:{

  },
}
</script>

<style scoped>

.right-button svg{
  position: absolute;
  right: 15px;
  top: 15px;
}

.right-button:hover{
  background-color: rgb(242,242,242);
}

.right-button{
  width: 100%;
  padding: 15px 15px;
  border-radius: 5px;
  cursor: pointer;
  line-height: 15px;
  position: relative;
  margin-bottom: 5px;
}

</style>